/**
 * [用户下级]
 * @Author: Fu Xiaochun
 * @Email:  fuzhengchun@ling1.org
 */
<template>
	<div id="userSubordinate">
		<div class="title"><a class="backPage iconfont icon-icon-test" @click="goBack"></a>返回</div>
		<el-row class="tableBtnTop">
			<div class="search">
				<el-input placeholder="请输入用户ID" @keyup.enter.native="onSearch" v-model.trim="uid">
					<i slot="prefix" class="el-input__icon el-icon-search"></i>
				</el-input>
			</div>
		</el-row>

		<user-list :tableData="tableData" :loading="loading"></user-list>

		<div class="paginationBlock">
			<el-pagination @current-change="changePage" layout="prev, pager, next, total" :total="count" :current-page="page" :page-size="pageSize" hide-on-single-page></el-pagination>
		</div>

	</div>
</template>

<script>
import fetch from '@/api/axios';
import {sysToYuan} from '@/utils/transPrice';
import {tsToDateFormat} from '@/utils/tsToDateFormat';
import UserList from  './userList';
export default {
	components: {
		'user-list': UserList
	},
	data() {
		return {
			loading: false,
			page: 1,
			pageSize: 10,
			count: 0,
			uid: '',
			tableData:[],
		}
	},
	created(){
		this.page = parseInt(this.$route.params.page || 1);
		this.uid = this.$route.params.uid;
		this.getList();
	},
	methods: {
		onSearch(){
			let page = 1;
			let uid = this.uid;
            this.page = page;
            if(uid){
                this.getList();
			    this.$router.push(`/user/subordinate/${uid}/page/${page}`);
            }else{
                this.$router.push(`/user/page/${page}`);
            }

		},
		getList(){
			let _this = this;
			this.loading = true;
			fetch.get('/api/console/user/down',{
				page: _this.page,
				keyword: _this.uid
			}).then((res)=>{
				let data = res.data;
				if(data.code == 0){
					_this.count = data.data.count;
					_this.pageSize = data.data.pagesize;
					_this.tableData = [...data.data.result];
				}else{
					_this.$message.error(data.message);
				}
			}).catch((err)=>{
				_this.$message.error(err.message);
			}).finally(()=>{
				_this.loading = false;
			});
		},
		changePage(page){
			let type = this.type;
			let uid = this.uid;
			this.page = page;
			this.$router.push(`/user/subordinate/${uid}/page/${page}`);
			this.getList();
        },
        goBack(){
            this.$router.go(-1);
        },
	},
	mounted() {

	},
	watch: {
		'$route':function(to){
			let params = to.params;
			this.page = parseInt(params.page);
			this.uid = params.uid || '';
			if(this.uid){
				this.getList();
			}
		}
	}
}
</script>
<style lang="scss" scoped>
#userSubordinate{
    .search{
        margin-left: 0;
    }
	.gender {
		width: 26px;
		height: 26px;
	}
	.leav{
		width: 20px;
		height: 20px;
		vertical-align: middle;
		margin-top:-2px;
		margin-right:10px;
	}
}
</style>